<script lang="ts" setup>

import {func, globalConfig} from "../js/Data.ts";
import {Formula} from "../js/Formula";

let pf = globalConfig.current.planet.pf

let addMachine = (f: Formula) => {
  let machine = globalConfig.inventory.get(f.machine)
  if (machine.ic == 0) {
    return
  }
  machine.ic -= 1
  f.machineCount += 1
  globalConfig.current.planet.pau += machine.ia
}

</script>

<template>
  <!--  <n-space>-->
  <!--    <n-button-group>-->
  <!--      <n-button :type="'' == globalConfig.filter.inventoryType ? 'primary' : 'default'" style="width: 100px"-->
  <!--                @click="globalConfig.filter.inventoryType = ''">-->
  <!--        全部-->
  <!--      </n-button>-->
  <!--      <n-button :type="'has' == globalConfig.filter.inventoryType ? 'primary' : 'default'" style="width: 100px"-->
  <!--                @click="globalConfig.filter.inventoryType = 'has'">-->
  <!--        拥有-->
  <!--      </n-button>-->
  <!--      <n-button :type="'full' == globalConfig.filter.inventoryType ? 'primary' : 'default'" style="width: 100px"-->
  <!--                @click="globalConfig.filter.inventoryType = 'full'">-->
  <!--        已满-->
  <!--      </n-button>-->
  <!--    </n-button-group>-->
  <!--  </n-space>-->
  <n-table :bordered="false" style="margin-top: 10px">
    <thead>
    <tr>
      <th>原料</th>
      <th>产物</th>
      <th>已分配机器</th>
      <th>操作</th>
    </tr>
    </thead>
    <tbody>
    <tr v-for="f in pf">
      <td>
        <n-image-group>
          <n-space>
            <span
                v-for="i in f.input"
            >
            <n-image
                :src=func.srcHandler(i.sim)
                width="32"
            />
            * {{ i.sin }} ({{ i.sic }})
              </span>
          </n-space>
        </n-image-group>
      </td>
      <td>
        <n-image-group>
          <n-space>
            <span
                v-for="i in f.output"
            >
            <n-image
                :src=func.srcHandler(i.pim)
                width="32"
            />
            * {{ i.pin }}({{ i.pic }})
              </span>
          </n-space>
        </n-image-group>
      </td>
      <td>
        {{ f.machineCount }}
      </td>
      <td>
        <n-button-group>
          <n-button
              type="default"
              @click="addMachine(f)"
          >
            增加机器
          </n-button>
        </n-button-group>
      </td>
    </tr>
    </tbody>
  </n-table>
</template>

<style scoped>

</style>